<template>
  <div class="afterSaleList">
    <TableList
      :linklist="linklist"
      :tableData="tableData"
      :btnList="btnList"
      :titleList="titleList"
    />
    <Footer>
      <template v-slot:choose><div></div></template>
      <template v-slot:paging
        ><Paging :total="totalSize" @getLimit="getLimit" @getPage="getPage"
      /></template>
    </Footer>
  </div>
</template>

<script>
import Footer from "../../components/Footer.vue";
import Paging from "../../components/Paging.vue";
import TableList from "../../components/List.vue";
import {
  afterSaleListAxios,
  afterSaleSpecificAxios,
} from "../../http/apis/afterSaleApi/";
import { timeFormat } from "../../utils/utils";
import { mapState } from "vuex";

export default {
  name: "AfterSaleList",
  components: {
    TableList,
    Paging,
    Footer,
  },
  computed: {
    ...mapState(["searchVal"]),
    ...mapState("afterSaleStore", ["highSearch"]),
  },
  data() {
    return {
      totalSize: 1, // 数据总数
      tableData: [
        {
          a_s_annex: "附件", //附件
          a_s_annexList: "附件$$附件", //附件
          a_s_employee: "超级管理员", //业务员
          a_s_goods: "商品", //售后相关商品
          a_s_id: 3, //售后信息表ID
          a_s_remark: "备注内容", // 备注
          a_s_results: "处理的结果", //处理结果
          a_s_state: 2, // 售后状态
          a_s_topic: "反馈", //售后主题
          a_s_type: "其他问题", //售后类型
          contact: { contact_name: "qyt" }, //联系Id
          customer: { customer_Name: "zjw" },
          customer_id: 1, //客户Id
          disposal_time: "2021-12-01 11:06", //处理时间
          feedback_time: "2021-12-01 11:08", //反馈时间
        },
      ],
      linklist: [
        {
          id: "0",
          isRouter: true,
          name: "客户名称",
          url: "/information/afterSaleInformation",
        },
        {
          id: "1",
          name: "联系人",
        },
        {
          id: "2",
          isRouter: true,
          name: "售后状态",
          url: "/afterSale/addAfterSale?state=state&",
        },
        {
          id: "3",
          name: "售后分类",
        },
        {
          id: "4",
          name: "反馈时间",
        },
        {
          id: "5",
          name: "相关商品",
        },
        {
          id: "6",
          name: "反馈主题",
        },
        {
          id: "7",
          name: "备注",
        },
        {
          id: "8",
          name: "处理时间",
        },
        {
          id: "9",
          name: "处理结果",
        },
        {
          id: "10",
          name: "业务员",
        },
        {
          id: "11",
          isRouter: true,
          name: "附件",
          url: "/afterSale/afterSaleAttachment",
        },
      ],
      btnList: [
        {
          id: "1",
          name: "修改",
          type: "售后",
        },
        {
          id: "2",
          name: "删除",
          type: "售后",
        },
      ],
      titleList: [
        "customer",
        "contact",
        "a_s_state",
        "a_s_type",
        "feedback_time",
        "a_s_goods",
        "a_s_topic",
        "a_s_remark",
        "disposal_time",
        "a_s_results",
        "a_s_employee",
        "a_s_annex",
      ],
      limit: 3,
      page: 1,
      obj: {
        // reserved: "", //自定义字段
        a_s_id: "", //编号
        customer: "", //客户名称
        contact: "", //联系人
        a_s_topic: "", //反馈主题
        a_s_remark: "", //备注
        a_s_type: "", //售后分类
        a_s_state: "", //售后状态
        a_s_employee: "", //业务员
        feedback_time: "", //反馈时间开始
        feedback_time01: "", //反馈时间结束
        disposal_time: "", //结束日期开始
        disposal_time01: "", //结束日期结束
      },
      val: "",
    };
  },
  methods: {
    handleClick(row) {
      console.log(row);
    },
    getLimit(val) {
      this.limit = val;
      console.log(this.limit);
      this.initiate();
    },
    getPage(val) {
      this.page = val;
      console.log("zzz", this.page);
      this.initiate();
    },

    //处理后端返回的数据
    getNewData(data) {
      const arr = data.data;
      this.totalSize = data.count;
      console.log(data);
      this.tableData = arr.map((item) => {
        item.contact = item.contact.contact_name || item.contact_name; // 联系人处理
        item.customer = item.customer.customer_name || item.customer; // 客户名处理
        item.a_s_annexList = item.a_s_annex; // 附件显示修改
        item.a_s_annex = "附件"
        if (item.a_s_state == 1) {
          item.disposal_time = "";
          item.a_s_results = "";
        }
        item.a_s_state =
          item.a_s_state == 1
            ? "未处理"
            : item.a_s_state == 2
            ? "处理中"
            : "已处理";
        item.a_s_type =
          item.a_s_type == 1
            ? "其他问题"
            : item.a_s_type == 2
            ? "操作问题"
            : item.a_s_type == 3
            ? "产品质量"
            : "";
        item.feedback_time = item.feedback_time
          ? timeFormat(item.feedback_time)
          : null;
        item.disposal_time = item.disposal_time
          ? timeFormat(item.disposal_time)
          : null;
        return item;
      });
    },
    //发起请求
    initiate() {
      console.log(this.obj);
      afterSaleListAxios(this.page, this.limit, this.obj)
        .then((res) => {
          console.log("data", res.data);
          if (res.data.code == 200) {
            this.getNewData(res.data);
          }
        })
        .catch((err) => {
          console.log("请求失败：", err);
        });
    },

    //判断售后状态后发起请求
    setAxios() {
      if (this.$route.query.afterState == "processed") {
        this.obj.a_s_state = 1;
        console.log("已处理", this.obj);
      } else if (this.$route.query.afterState == "processing") {
        this.obj.a_s_state = 2;
        console.log("处理中", this.obj.a_s_state);
      } else if (this.$route.query.afterState == "untreated") {
        this.obj.a_s_state = 3;
        console.log("未处理", this.obj.a_s_state);
      } else {
        this.obj.a_s_state = null;
        console.log("全部", this.obj.a_s_state);
      }
      this.initiate();
    },
  },
  created() {
    // 判断是否为个人信息页面
    if (this.$route.path == "/information/afterSaleInformation") {
      this.linklist.splice(0, 1);
      this.obj.customer_id = this.$route.query.info.customer_id;
    }

    console.log(this.obj);
    // this.initiate();
    this.setAxios();
    // this.getNewData(this.tableData);
  },
  mounted() {},
  watch: {
    // 路由改变时,改变售后状态判定
    $route(to) {
      console.log(to);
      this.setAxios();
    },

    // 简单搜索
    searchVal(val) {
      if (!val) return;
      console.log(val);
      this.val = val;
      // this.sendEasyRequest(val);

      afterSaleSpecificAxios(this.page, this.limit, this.val)
        .then((res) => {
          console.log(res.data);
          if (res.data.code == 200) {
            this.getNewData(res.data);
          }
        })
        .catch((err) => {
          console.log("请求失败：", err);
        });
    },

    // 高级搜索
    highSearch: {
      handler: function (val) {
        this.obj = val;
        console.log(this.obj);
        this.initiate();
      },
      deep: true,
    },
  },
};
</script>


<style>
</style>